<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>初始Vuejs</title>
    <!--第一步：导入vue.js，他的目的通过vue.js核心库构建我们vue实例对象 -->
    <script src="../js/vue.js"></script>
    <!-- 这是我在gitee官网编辑的内容    -->
    <!-- dfadsfasd -->

    <!--哈哈哈哈-->
    <!-- dfadsfasd -->
    <!-- dfadsfasd --><!-- dfadsfasd -->

</head>
<body>
    <!-- 2.准备一个容器，目的是在页面上显示数据，
        加载vue实例对象data的数据 -->
        <!-- 整个div 就是vue的一个模板 -->
    <div class="app">
        <h2>在vue里面有一种特殊的语法，他可以渲染data对象中的属性的值</h2>
        <h3>插值语法：{{hello}}</h3>
        <h4>{{name}}</h4>
        <h5>{{3>=3?a:b}}</h5>
        <input type="" id=""  name=""  value=""/>
    </div>
</body>
<!-- 通过new关键字 构造方法（options配置项）实例化一个Vue实例对象 -->
   <script>
    //在vue实例化之前阻止 vue 在启动时生成生产提示。
    Vue.config.productionTip = false
    //如果没有写 new 关键字，name就会报错：Vue is a constructor and should be called with the `new` keyword
   new Vue({
        'el': '.app',//就是说通过ID选择器将我们容器挂在到Vue实例对象上
        // 页面上要显示的数据定义在data里面
        data: {
            hello: '邂逅vuejs',
            name: 'tofacebook.com',
            a: 1,
            b: 2
        }
    })

   </script>
</html>
